<%@ page language="java" pageEncoding="UTF-8"%>
<script src="${baseURL}/js/handlebars/handlebars-min.js"></script>
<script id="searchForm" type="text/x-handlebars-template">
<form class="navigator-search query-component generic-styled" onsubmit="return false;">
	<div class="search-criteria">
		<ul class="criteria-list">
			{{#if showExtend}}
			<li class="criteria-actions">
				<button type="button"
					class="add-criteria aui-button aui-button-subtle drop-arrow"
					original-title="Add more fields to search with"
					style="display: inline-block;">更多</button>
			</li>
			{{/if}}
			{{#if showButton}}
			<li>
				<button class="aui-button aui-button-subtle search-button"
					type="button" original-title="Search for issues">
					<span class="aui-icon aui-icon-small aui-iconfont-search bd bd-search"></span> 搜索
				</button>
				<button class="aui-button aui-button-subtle reset-button"
					type="button" original-title="Search for issues">
					<span class="aui-icon aui-icon-small aui-iconfont-search bd bd-exchange"></span> 重置
				</button>
			</li>
			{{/if}}
		</ul>
	</div>
	{{#if showExtend}}
	<div class="search-criteria-extended">
		<ul class="criteria-list">
		</ul>
	</div>
	{{/if}}
</form>
</script>
<!-- 0：下拉多选框  eg:{id:"orderSource",name:"订单来源",value:null,valueText:"全部",isExtended:false,selectType:0} -->
<script id="multiComboBoxQuery" type="text/x-handlebars-template">
	<li selector-id="{{id}}" class="multi-combobox-query">
		<button type="button" data-id="{{id}}" data-value="{{value}}" class="criteria-selector aui-button aui-button-subtle drop-arrow {{#if isExtended}}criteria-selector-extended{{/if}}">
			<div class="criteria-wrap">
				<span class="fieldLabel">{{name}}：</span> 
				<div class="searcherValue">
					<span id="fieldfixfor" title="{{valueText}}" class="fieldValue">{{valueText}}</span>
				</div>
			</div>
		</button>
		{{#if isExtended}}
		<a href="#" class="select-remove-filter remove-filter-a" title="Remove criterion" tabindex="-1">
			<span class="aui-icon aui-icon-small aui-iconfont-remove bd bd-times-circle-o"></span>
		</a>
		{{/if}}
	</li>
</script>
<!-- 1：模糊搜索框  eg:{id:"code",name:"系统单号/第三方单号/批次号",value:"",isExtended:false,selectType:1,tagName:"name;code"} -->
<script id="textQuery" type="text/x-handlebars-template">
	<li class="text-query" selector-id="{{id}}">
		<div class="text-query-container inline-middle">
			<input class="search-entry text ajs-dirty-warning-exempt"
			id="{{id}}" type="text" name="{{id}}" placeholder="{{name}}" value="{{value}}">
		</div>
		{{#if isExtended}}
		<a href="#" class="select-remove-filter remove-filter-a" title="Remove criterion" tabindex="-1">
			<span class="aui-icon aui-icon-small aui-iconfont-remove bd bd-times-circle-o"></span>
		</a>
		{{/if}}
	</li>
</script>
<!-- 2:checkbox选择器  eg:{id:"isStaffChild",name:"是否教职工子女",checkValue:1,noCheckValue:0,selectType:2,value:"",isExtended:false,valueText:"全部"} -->
<script id="checkboxQuery" type="text/x-handlebars-template">
	<li class="checkbox-query" selector-id="{{id}}">
		<div class="text-query-container inline-middle">
			<input id="{{id}}" type="checkbox" class="inline-middle search-check" name="{{id}}"
			no-check-value="{{noCheckValue}}" value="{{checkValue}}" {{#equals value checkValue}}checked="checked"{{/equals}}> 
			<span class="selector-field-name inline-middle">{{name}}</span>
		</div>
		{{#if isExtended}}
		<a href="#" class="remove-filter inline-middle remove-filter-a" title="Remove criterion" tabindex="-1">
			<span class="aui-icon aui-icon-small aui-iconfont-remove bd bd-times-circle-o"></span>
		</a>
		{{/if}}
	</li>
</script>
<!-- 3:自动匹配搜索框，单选  eg:{id:"goodsId",name:"商品",value:null,valueText:"全部",isExtended:false,selectType:3,tagName:"student_name;student_code"} -->
<script id="autocompleteQuery" type="text/x-handlebars-template">
	<li selector-id="{{id}}" class="autocomplete-query">
		<button type="button" data-id="{{id}}" data-tag="{{searchTag}}" data-value="{{value}}" class="criteria-selector criteria-selector-auto aui-button aui-button-subtle drop-arrow {{#if isExtended}}criteria-selector-extended{{/if}}">
			<div class="criteria-wrap">
				<span class="fieldLabel">{{name}}：</span> 
				<div class="searcherValue">
					<span id="fieldfixfor" title="{{valueText}}" class="fieldValue">{{valueText}}</span>
				</div>
			</div>
		</button>
		{{#if isExtended}}
		<a href="#" class="select-remove-filter remove-filter-a" title="Remove criterion" tabindex="-1">
			<span class="aui-icon aui-icon-small aui-iconfont-remove bd bd-times-circle-o"></span>
		</a>
		{{/if}}
	</li>
</script>
<!-- 4:用户自定义搜索框，例如树 eg:{id:"typeId",name:"商品类别",value:null,valueText:"全部",isExtended:false,selectType:4,render:function($element,searchParam){var data = new String(JSON.stringify(searchParam.param));return loadTree($element,JSON.parse(data),searchParam.id);}} -->
<script id="userDefinedQuery" type="text/x-handlebars-template">
	<li selector-id="{{id}}" class="user-defined-query">
		<button type="button" data-id="{{id}}" data-value="{{value}}" class="criteria-selector criteria-selector-defined aui-button aui-button-subtle drop-arrow {{#if isExtended}}criteria-selector-extended{{/if}}">
			<div class="criteria-wrap">
				<span class="fieldLabel">{{name}}：</span> 
				<div class="searcherValue">
					<span id="fieldfixfor" title="{{valueText}}" class="fieldValue">{{valueText}}</span>
				</div>
			</div>
		</button>
		{{#if isExtended}}
		<a href="#" class="select-remove-filter remove-filter-a" title="Remove criterion" tabindex="-1">
			<span class="aui-icon aui-icon-small aui-iconfont-remove bd bd-times-circle-o"></span>
		</a>
		{{/if}}
	</li>
</script>
<!-- 5:时间选择器  eg:{id:"orderTime",name:"下单日期",value:"",valueText:"全部",isExtended:false,selectType:5,formate:"yyyy-MM-dd",afterTime:null,beforeTime:null,startTime:null,endTime:null,type:0,measurement:null} -->
<script id="dateQuery" type="text/x-handlebars-template">
	<li selector-id="{{id}}" class="date-query">
		<button type="button" data-id="{{id}}" startDay="{{startDay}}" endDay="{{endDay}}" startYear="{{startYear}}" endYear="{{endYear}}" startTime="{{startTime}}" endTime="{{startTime}}" afterTime="{{afterTime}}" 
			beforeTime="{{beforeTime}}" data-type="{{type}}" data-measurement="{{measurement}}" class="criteria-selector criteria-selector-date aui-button aui-button-subtle 
			drop-arrow {{#if isExtended}}criteria-selector-extended{{/if}}">
			<div class="criteria-wrap">
				<span class="fieldLabel">{{name}}：</span> 
				<div class="searcherValue">
					<span id="fieldfixfor" title="{{valueText}}" class="fieldValue">{{valueText}}</span>
				</div>
			</div>
		</button>
		{{#if isExtended}}
		<a href="#" class="select-remove-filter remove-filter-a" title="Remove criterion" tabindex="-1">
			<span class="aui-icon aui-icon-small aui-iconfont-remove bd bd-times-circle-o"></span>
		</a>
		{{/if}}
	</li>
</script>
<!-- 6：数字区间范围搜索框  eg:{id:"totalSalesMoney",name:"销售金额",minNum:1,maxNum:2,valueText:"全部",isExtended:true,selectType:6} -->
<script id="numberQuery" type="text/x-handlebars-template">
	<li selector-id="{{id}}" class="number-query">
		<button type="button" data-id="{{id}}" minNum="{{minNum}}" maxNum="{{maxNum}}" class="criteria-selector criteria-selector-number aui-button aui-button-subtle drop-arrow {{#if isExtended}}criteria-selector-extended{{/if}}">
			<div class="criteria-wrap">
				<span class="fieldLabel">{{name}}：</span> 
				<div class="searcherValue">
					<span id="fieldfixfor" title="{{valueText}}" class="fieldValue">{{valueText}}</span>
				</div>
			</div>
		</button>
		{{#if isExtended}}
		<a href="#" class="select-remove-filter remove-filter-a" title="Remove criterion" tabindex="-1">
			<span class="aui-icon aui-icon-small aui-iconfont-remove bd bd-times-circle-o"></span>
		</a>
		{{/if}}
	</li>
</script>
<!-- 7：自动匹配搜索框，多选  eg:{id:"goodsId",name:"商品",value:null,valueText:"全部",isExtended:false,selectType:7,tagName:"student_name;student_code"} -->
<script id="autocompleteMultiQuery" type="text/x-handlebars-template">
	<li class="autocomplete-multi-query" selector-id="{{id}}">
		<div class="text-query-container inline-middle criteria-selector criteria-selector-input-auto" data-id="{{id}}" data-tag="{{searchTag}}" data-value="">
			<input class="search-auto-entry text ajs-dirty-warning-exempt"
			id="{{id}}" type="text" name="{{id}}" placeholder="{{name}}" value="{{value}}">
		</div>
		{{#if isExtended}}
		<a href="#" class="remove-filter inline-middle remove-filter-a" title="Remove criterion" tabindex="-1">
			<span class="aui-icon aui-icon-small aui-iconfont-remove bd bd-times-circle-o"></span>
		</a>
		{{/if}}
	</li>
</script>
<!-- 8:组合搜索框，多种类型组合搜索  eg:{id:"goodsStatus",name:"商品状态",value:null,valueText:"全部",isExtended:false,selectType:8,trueOrFalse:true} -->
<script id="multiGroupQuery" type="text/x-handlebars-template">
	<li selector-id="{{id}}" class="multi-group-query">
		<button type="button" data-id="{{id}}" data-value="{{value}}" class="criteria-selector criteria-multi-selector aui-button aui-button-subtle drop-arrow {{#if isExtended}}criteria-selector-extended{{/if}}">
			<div class="criteria-wrap">
				<span class="fieldLabel">{{name}}：</span> 
				<div class="searcherValue">
					<span id="fieldfixfor" title="{{valueText}}" class="fieldValue">{{valueText}}</span>
				</div>
			</div>
		</button>
		{{#if isExtended}}
		<a href="#" class="select-remove-filter remove-filter-a" title="Remove criterion" tabindex="-1">
			<span class="aui-icon aui-icon-small aui-iconfont-remove bd bd-times-circle-o"></span>
		</a>
		{{/if}}
	</li>
</script>
<!-- 9：下拉单选框  eg:{id:"orderSource",name:"订单来源",value:null,valueText:"全部",isExtended:false,selectType:9} -->
<script id="comboBoxQuery" type="text/x-handlebars-template">
	<li selector-id="{{id}}" class="radio-selector">
		<button type="button" data-id="{{id}}" data-value="{{value}}" class="criteria-selector radio-criteria-selector aui-button aui-button-subtle drop-arrow">
			<div class="criteria-wrap">
				<span class="fieldLabel">{{name}}：</span> 
				<div class="searcherValue">
					<span id="fieldfixfor" title="{{valueText}}" class="fieldValue">{{valueText}}</span>
				</div>
			</div>
		</button>
		{{#if isExtended}}
		<a href="#" class="select-remove-filter remove-filter-a" title="Remove criterion" tabindex="-1">
			<span class="aui-icon aui-icon-small aui-iconfont-remove bd bd-times-circle-o"></span>
		</a>
		{{/if}}
	</li>
</script>
<!-- 10:时间选择器  eg:{id:"orderTime",name:"下单日期",value:"2017-9",valueText:"全部",isExtended:false,selectType:10,formate:"yyyy-MM-dd"} -->
<script id="yearMonthQuery" type="text/x-handlebars-template">
	<li selector-id="{{id}}" class="year-month-query">
		<div class="criteria-selector inline-middle">
			<span class="fieldLabel">{{name}}：</span> 
			<input class="js-val-day form-control short-element inline-block" name="startDay" type="text" value="{{value}}" placeholder="{{valueText}}"/>
		</div>
		{{#if isExtended}}
		<a href="#" class="select-remove-filter remove-filter-a" title="Remove criterion" tabindex="-1">
			<span class="aui-icon aui-icon-small aui-iconfont-remove bd bd-times-circle-o"></span>
		</a>
		{{/if}}
	</li>
</script>
<!-- 下拉多选选择器的内容，下拉选择 -->
<script id="multiComboBoxContainer" type="text/x-handlebars-template">
	<ul class="aui-list" data-id="{{id}}">
		{{#each param}}
		<li class="check-list-item imagebacked">
			<label class="item-label">
				<input type="checkbox" value="{{id}}" alt="{{text}}" class="inline-middle search-checkbox">
				<span class="inline-middle">
				{{text}}
				</span>
			</label>
		</li>
		{{/each}}
	</ul>
</script>
<!-- 下拉单选选择器的内容，下拉选择 -->
<script id="comboBoxContainer" type="text/x-handlebars-template">
	<ul class="aui-list" data-id="{{id}}">
		{{#each param}}
		<li class="check-list-item check-list-item-span imagebacked" value="{{id}}" alt="{{text}}">
			<label class="item-label">
				<span class="inline-middle">
				{{text}}
				</span>
			</label>
		</li>
		{{/each}}
	</ul>
</script>
<!-- 组合选择器内容，下拉选择 -->
<script id="multiGroupContainer" type="text/x-handlebars-template">
	<ul class="aui-list" data-id="{{id}}">
		{{#each param}}
		<li class="check-list-item imagebacked">
			<label class="item-label">
				<input type="checkbox" value="{{id}}" alt="{{text}}" data-param={{params}} class="inline-middle search-multi-checkbox {{params}}">
				<span class="inline-middle">
				{{text}}
				</span>
			</label>
		</li>
		{{/each}}
	</ul>
</script>
<!-- 自动匹配搜索，下拉选择 -->
<script id="autoContainer" type="text/x-handlebars-template">
	<div class="check-list-field-container">
		<input autocomplete="off" placeholder="查找{{name}}..." class="searcher-status-input aui-field check-list-field" 
			wrap="off">
		<span class="icon noloading"><i class="bd bd-search"></i></span>
	</div>
</script>
<!-- 数字选择器内容 -->
<script id="numberContainer" type="text/x-handlebars-template">
	<div class="check-list-field-container" style="padding: 10px 10px;">
		<label for="withinTheLastRadio">在</label>
		<input name="minNum" placeholder="最小值" class="aui-field l-text"/>
		<label for="withinTheLastRadio">到</label>
		<input name="maxNum" placeholder="最大值" class="aui-field l-text"/>
		<label for="withinTheLastRadio">之间</label>
	</div>
	<div class="buttons-container form-footer" data-id="{{this}}">
		<input type="button" name="filter" class="aui-button filter-button" value="搜索">
	</div>
</script>
<!-- 日期间隔选择器内容 -->
<script id="dateContainer" type="text/x-handlebars-template">
	<ul class="aui-list date-ul" data-id="{{id}}">
		{{#equals formate "yyyy-MM-dd"}}
		<li class="radio-list-item">
			<label class="item-label">
				<input type="radio" value="0" name="{{id}}" class="inline-middle selector-radio">
				<div class="inline-middle field-group">
					<label for="withinTheLastRadio">在</label>
					<input style="display:inline-block;width: 150px;" class="js-val-date form-control short-element" name="startTime" type="text">
					<label for="withinTheLastRadio">和</label>
					<input style="display:inline-block;width: 150px;" class="js-val-date form-control short-element" name="endTime" type="text">
					<label for="withinTheLastRadio">之间</label>
				</div>
			</label>
		</li>
		<li class="radio-list-item">
			<label class="item-label">
				<input type="radio" value="1" name="{{id}}" class="inline-middle selector-radio">
				<div class="inline-middle field-group">
					<label for="withinTheLastRadio">在过去的</label>
					<input class="js-val" name="afterTime" type="text">
					<select class="js-measurement afterTime-measurement" >
						<!--<option value="m">分钟</option>-->
						<!--<option value="h">小时</option>-->
						<option value="d">天</option>
						<option value="w">周</option>
						<option value="month">个月</option>
						<option value="y">年</option>
					</select>
					<label for="withinTheLastRadio">之内</label>
				</div>
			</label>
		</li>
		<li class="radio-list-item">
			<label class="item-label">
				<input type="radio" value="2" name="{{id}}" class="inline-middle selector-radio">
				<div class="inline-middle field-group">
					<label for="withinTheLastRadio">超过</label>
					<input class="js-val" name="beforeTime" type="text">
					<select class="js-measurement beforeTime-measurement">
						<!--<option value="m">分钟</option>-->
						<!--<option value="h">小时</option>-->
						<option value="d">天</option>
						<option value="w">周</option>
						<option value="month">个月</option>
						<option value="y">年</option>
					</select>
					<label for="withinTheLastRadio">之前</label>
				</div>
			</label>
		</li>
		{{/equals}}
		{{#equals formate "MM-dd"}}
		<div class="inline-middle field-group" style="padding: 10px 0px;">
			<label for="withinTheLastRadio">在</label>
			<input class="js-val-day" name="startDay" type="text">
			<label for="withinTheLastRadio">和</label>
			<input class="js-val-day" name="endDay" type="text">
			<label for="withinTheLastRadio">之间</label>
		</div>
		{{/equals}}
		{{#equals formate "yyyy-MM"}}
		<div class="inline-middle field-group" style="padding: 10px 0px;">
			<label for="withinTheLastRadio">在</label>
			<input class="js-val-day" name="startDay" type="text">
			<label for="withinTheLastRadio">和</label>
			<input class="js-val-day" name="endDay" type="text">
			<label for="withinTheLastRadio">之间</label>
		</div>
		{{/equals}}
		{{#equals formate "yyyy-yyyy"}}
		<div class="inline-middle field-group" style="padding: 10px 0px;">
			<label for="withinTheLastRadio">在</label>
			<input style="display:inline-block;" class="js-val-day form-control short-element" name="startYear" type="text">
			<label for="withinTheLastRadio">和</label>
			<input style="display:inline-block;" class="js-val-day form-control short-element" name="endYear" type="text">
			<label for="withinTheLastRadio">之间</label>
		</div>
		{{/equals}}
		{{#equals formate "yyyy-yyyy-dbischar"}}
		<div class="inline-middle field-group" style="padding: 10px 0px;">
			<label for="withinTheLastRadio">在</label>
			<input style="display:inline-block;" class="js-val-day form-control short-element" name="startYear" type="text">
			<label for="withinTheLastRadio">和</label>
			<input style="display:inline-block;" class="js-val-day form-control short-element" name="endYear" type="text">
			<label for="withinTheLastRadio">之间</label>
		</div>
		{{/equals}}
	</ul>
	<div class="buttons-container form-footer" data-id="{{id}}">
		<input type="button" name="filter" class="aui-button filter-button" value="搜索">
	</div>
</script>
<!-- “更多”选择器下拉框 -->
<script id="moreContainer" type="text/x-handlebars-template">
	<ul class="aui-list" id="searcher-status-suggestions">
		{{#each this}}
		<li class="check-list-item">
			<label class="item-label">
				<input type="checkbox" value="{{id}}" class="inline-middle selector-checkbox">
				<span class="inline-middle">
				{{name}}
				</span>
			</label>
		</li>
		{{/each}}
	</ul>
</script>
<script>
Handlebars.registerHelper("equals",function(v1,v2,options){
	 if(v1==v2){
	 	//满足添加继续执行
		return options.fn(this);
	 }else{
	 	//不满足条件执行{{else}}部分
	 	return options.inverse(this);
	 }
});
</script>
<script src='${baseURL}/js/jquery.autocomplete.selector.js'></script>
<script src="${baseURL}/js/jquery.cookie.js" type="text/javascript"></script>
<script src="${baseURL}/js/module/sd.selector.js" type="text/javascript"></script>

<script type="text/javascript">
	var manager = null;
	function loadTree($element,data,value,selectorId,selector){
		$element.addClass("l-tree").attr("data-id",selectorId);
		var treeData = new Array();
		$.each(data, function(index, each){
			treeData.push(each);
		})
		if(manager){
			manager.clear();
		}
		manager = $element.ligerTree({
			data: JSON.parse(JSON.stringify(data)),
			idFieldName : 'id',
			parentIDFieldName : 'parentId',
			textFieldName : 'text',
			onCheck: onSelected,
			onSelect:onSelect,
			treeLine:false,
			parentIcon:"",
			childIcon:"",
			checkbox: true
		});
		if(value){
			var values = value.split(";");
			for(var i=0;i<values.length;i++){
				$("#"+values[i]).each(function(){
					$(this).children(".l-body").children(".l-checkbox-unchecked").click();
				});
			}
		}
		
		function onSelect(node){
			$(node.target).children(".l-body").children(".l-checkbox").click();
	 	}
		
		function onSelected(){
			var datas = manager.getChecked();
			var values = {};
			for(var i=0;i<datas.length;i++){
				values[datas[i].data.id] = datas[i].data.text;
			}
			var ids = "";
			var text = "";
			var i=0;
			for(var key in values){
				if(i==0){
					ids = key;
					text = values[key];
				}else{
					ids += ";"+key;
					text += "，"+values[key];
				}
				i++;
			}
			selector.setSelectorValue("PRODUCT_1_CODE_ID",ids,text);
			selector.search();
		}
		
	}
	
	function renderTree($element, value, searchParam,selector) {
		return loadTree($element,searchParam.param,value,searchParam.id,selector);
	}
	//搜索框-弹出商品品种窗口（搜索ID）
	function loadDialog($element, value, searchParam,selector,single){
		var num = 0;
		if(single === true){
			num = 1;
		}
		$(this).zljgAddressBook({openType : "frame",type:[8],idFieldId:"",num: num,textFieldId:"",callback : function(msg){
			//组装搜索IDS
			var ids = "";
			for (var i=0; i<msg.data.length; i++) {
				ids = ids + msg.data[i].id + ";";
			}
			ids = ids.substring(0,ids.length-1);
			selector.setSelectorValue("GOODS_CATALOG_ID", ids, msg.texts);
			selector.search();
		}});
	}
	//搜索框-弹出商品品种窗口（搜索name）
	function loadGoodsCatalogNameDialog($element, value, searchParam,selector,single){
		var num = 0;
		if(single === true){
			num = 1;
		}
		$(this).zljgAddressBook({openType : "frame",type:[8],idFieldId:"",num: num,textFieldId:"",callback : function(msg){
			var names = "";
			for (var i=0; i<msg.data.length; i++) {
				names = names + msg.data[i].text + ";";
			}
			names = names.substring(0,names.length-1);
			selector.setSelectorValue("GOODS_CATALOG_NAME", names, msg.texts);
			selector.search();
		}});
	}
</script>